<template>
  <div>
    <!-- 查询区域 -->
    <a-form layout="inline" :form="form" @submit="handleSubmit">
      <a-form-item label="行政区">
        <a-select
          style="width: 140px"
          v-model="form.city"
          @change="changeCity"
          :disabled="isInput"
        >
          <a-select-option
            :value="item.no"
            v-for="(item, index) in citydata"
            :key="index"
            >{{ item.name }}</a-select-option
          >
        </a-select>
      </a-form-item>
      <a-form-item>
        <a-select style="width: 140px" v-model="form.area" :disabled="isInput2">
          <a-select-option
            :value="item.no"
            v-for="(item, index) in xiandata"
            :key="index"
            >{{ item.name }}</a-select-option
          >
        </a-select>
      </a-form-item>
      <a-form-item label="上报类型">
        <a-select style="width: 120px" v-model="form.sblx">
          <a-select-option value="">全部</a-select-option>
          <a-select-option value="1">已上报</a-select-option>
          <a-select-option value="0">未上报</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="项目阶段">
        <a-select style="width: 140px" v-model="form.xmjd">
          <a-select-option
            :value="item.key"
            v-for="item in xmjdlist"
            :key="item.key"
            >{{ item.value }}</a-select-option
          >
        </a-select>
      </a-form-item>

      <a-form-item label="上报日期">
        <a-date-picker
          style="width: 140px"
          v-model="form.begintime"
          format="YYYY-MM-DD"
          valueFormat="YYYY-MM-DD"
        />
      </a-form-item>
      <a-form-item label="到">
        <a-date-picker
          style="width: 140px"
          v-model="form.endtime"
          format="YYYY-MM-DD"
          valueFormat="YYYY-MM-DD"
        />
      </a-form-item>
      <a-form-item label="项目名称">
        <a-input style="width: 130px" v-model="form.keyWord" />
      </a-form-item>
      <a-form-item>
        <a-radio-group name="radioGroup" v-model="tjtype">
          <a-radio :value="1"> 按照地市统计</a-radio>
          <a-radio :value="2"> 按项目统计</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item label="设施农用地类型">
        <a-checkbox-group v-model="form.type">
          <a-checkbox value="1">作物种植设施农用地 </a-checkbox>
          <a-checkbox value="2">畜禽水产养殖设施农用地</a-checkbox>
          <a-checkbox value="3">种养一体</a-checkbox>
        </a-checkbox-group>
      </a-form-item>
      &nbsp; &nbsp; &nbsp; &nbsp;
      <a-form-item label="二级分类">
        <a-checkbox-group v-model="form.xmld1" @change="ZWchangAll">
          <a-dropdown>
            <a-checkbox
              :value="allCheckboxValue"
              class="ant-dropdown-link"
              :indeterminate="indeterminate"
              @change="ZWchang"
              >作物
            </a-checkbox>
            <br />
            <a-menu slot="overlay">
              <a-menu-item v-for="(item, index) in zwdata" :key="index">
                <a-checkbox :value="item.value">{{ item.label }} </a-checkbox>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </a-checkbox-group>

        <a-checkbox-group v-model="form.xmld2" @change="CLchageAll">
          <a-dropdown>
            <a-checkbox
              :value="clCheckboxValue"
              class="ant-dropdown-link"
              :indeterminate="clindeterminate"
              @change="CLchang"
              >畜类
            </a-checkbox>
            <a-menu slot="overlay">
              <a-menu-item v-for="(item, index) in cldata" :key="index">
                <a-checkbox :value="item.value"
                  >{{ item.label }}
                </a-checkbox></a-menu-item
              >
            </a-menu>
          </a-dropdown>
        </a-checkbox-group>
        <a-checkbox-group v-model="form.xmld3" @change="QLchangeAll">
          <a-dropdown>
            <a-checkbox
              :value="qlheckboxValue"
              class="ant-dropdown-link"
              :indeterminate="qlindeterminate"
              @change="qlchange"
              >禽类
            </a-checkbox>
            <a-menu slot="overlay">
              <a-menu-item v-for="(item, index) in qldata" :key="index">
                <a-checkbox :value="item.value"
                  >{{ item.label }}
                </a-checkbox></a-menu-item
              >
            </a-menu>
          </a-dropdown>
        </a-checkbox-group>
        <a-checkbox-group v-model="form.xmld4" @change="SCchangeAll">
          <a-dropdown>
            <a-checkbox
              :value="scheckboxValue"
              class="ant-dropdown-link"
              :indeterminate="scindeterminate"
              @change="SCchange"
              >水产
            </a-checkbox>
            <a-menu slot="overlay">
              <a-menu-item v-for="(item, index) in scdata" :key="index">
                <a-checkbox :value="item.value"
                  >{{ item.label }}
                </a-checkbox></a-menu-item
              >
            </a-menu>
          </a-dropdown>
        </a-checkbox-group>
      </a-form-item>
      <a-form-item>
        <a-button type="primary" @click="handleSubmit"> 查询 </a-button>
        <a-button type="primary" style="margin-left: 10px" @click="exportdata">
          导出EXCEL
        </a-button>
        <a-button type="primary" style="margin-left: 10px"> 导出坐标 </a-button>
      </a-form-item>
    </a-form>
    <div class="title">
      <div class="title_data">总体情况</div>
    </div>
    <br />
    <div class="ztqk">
      <div
        class="ztqk_left"
        style="display: flex; justify-content: space-between; width: 70%"
      >
        <div style="width: 16%; background-color: red" class="box box1">
          <div class="box_title">项目个数</div>
          <div class="box_num">{{ xmgsdata.xmgs }}</div>
        </div>
        <div style="width: 16%; background-color: red" class="box box2">
          <div class="box_title">申请用地面积(公顷)</div>
          <div class="box_num">{{ xmgsdata.xmZydmj }}</div>
        </div>
        <div style="width: 16%; background-color: red" class="box box3">
          <div class="box_title">生产设施用地(公顷)</div>
          <div class="box_num">{{ xmgsdata.xmScssydmj }}</div>
        </div>
        <div style="width: 16%; background-color: red" class="box box4">
          <div class="box_title">辅助设施用地(公顷)</div>
          <div class="box_num">{{ xmgsdata.xmFzssydmj }}</div>
        </div>
        <div style="width: 16%; background-color: red" class="box box5">
          <div class="box_title">永久基本农田(公顷)</div>
          <div class="box_num">{{ xmgsdata.xmQzjbntmj }}</div>
        </div>
        <div style="width: 16%; background-color: red" class="box box6">
          <div class="box_title">破坏耕地作层(公顷)</div>
          <div class="box_num">{{ xmgsdata.xmPhgdgzcmj }}</div>
        </div>
      </div>
      <div class="ztqk_right">
        <div class="ztqk_title">相关文件及技术规程</div>
        <div>
          <a>自然资源部 农业农村部关于设施农业用地管理有关问题的通知.pdf</a>
        </div>
        <div><a>关于印发《山东省设施农业用地管理办法》的通知.pdf</a></div>
        <div><a>关于进一步规范设施农业用地上图入库有关事项的通知.pdf</a></div>
      </div>
    </div>
    <br />
    <div class="title">
      <div class="title_data">行政区用地情况</div>
    </div>
    <div style="display: flex">
      <div style="width: 90%">
        <EcTable ref="EcTable" :legendData="legendData" :form="form"></EcTable>
      </div>
      <div>
        <br />
        <a-button type="primary" @click="landarea(1)">用地面积</a-button>
        <a-button type="primary" style="margin-top: 10px" @click="Pjtnum(1)"
          >项目个数</a-button
        >
      </div>
    </div>

    <div class="title">
      <div class="title_data">养殖类统计</div>
    </div>
    <div style="display: flex">
      <div style="width: 90%"><columnar ref="columnar"  :breedData="breedData" :form="form"></columnar></div>
      <div>
        <br />
        <a-button type="primary" @click="landarea(2)">用地面积</a-button>
        <a-button type="primary" style="margin-top: 10px" @click="Pjtnum(2)">项目个数</a-button>
      </div>
    </div>
    <div class="title">
      <div class="title_data">分阶段统计</div>
    </div>
    <div style="display: flex">
      <div style="width: 90%"><Stage ref="Stage" :stageData="stageData" :form="form" ></Stage></div>
      <div>
        <br />
        <a-button type="primary" @click="landarea(3)">用地面积</a-button>
        <a-button type="primary" style="margin-top: 10px"  @click="Pjtnum(3)">项目个数</a-button>
      </div>
    </div>
    <a-card>
      <div>数据列表</div>
      <br />
      <table
        class="table"
        border="1"
        cellspacing="0"
        cellpadding="0"
        v-if="istable == false"
      >
        <tr class="trtitle">
          <td rowspan="2">行政区</td>
          <td rowspan="2">项目个数</td>
          <td rowspan="2">生产规模</td>
          <td rowspan="2">项目总投资</td>
          <td rowspan="2">项目总用地面积</td>
          <td colspan="2">按功能分区</td>
          <td colspan="4">其中面积</td>
          <td colspan="2">破坏耕作层面积</td>
        </tr>
        <tr class="trtitle">
          <td>生产用地</td>
          <td>生产辅助用地</td>
          <td>农用地</td>
          <td>耕地</td>
          <td>永久基本农田</td>
          <td>补划永久基本农田</td>
          <td>破坏耕地耕作层</td>
          <td>破坏永久基本农田耕作层</td>
        </tr>
        <tr v-for="(item, index) in hjdata" :key="index" class="trtitle">
          <td>{{ item.name }}</td>
          <td>{{ item.xmgs }}</td>
          <td>{{ item.xmScgm }}</td>
          <td>{{ item.xmZtz }}</td>
          <td>{{ item.xmZydmj }}</td>
          <td>{{ item.scZmj }}</td>
          <td>{{ item.fzZmj }}</td>
          <td>{{ item.xmSyndtmj }}</td>
          <td>{{ item.xmSygdmj }}</td>
          <td>{{ item.xmQzjbntmj }}</td>
          <td>{{ item.xmBhyjjbntmj }}</td>
          <td>{{ item.xmPhgdgzcmj }}</td>
          <td>{{ item.xmQzphyjjbntgzcmj }}</td>
        </tr>
        <tr v-for="(item, index) in tjcitylist" :key="index">
          <td>{{ item.cityname }}</td>
          <td>{{ item.xmgs }}</td>
          <td>{{ item.xmScgm }}</td>
          <td>{{ item.xmZtz }}</td>
          <td>{{ item.xmZydmj }}</td>
          <td>{{ item.scZmj }}</td>
          <td>{{ item.fzZmj }}</td>
          <td>{{ item.xmSyndtmj }}</td>
          <td>{{ item.xmSygdmj }}</td>
          <td>{{ item.xmQzjbntmj }}</td>
          <td>{{ item.xmBhyjjbntmj }}</td>
          <td>{{ item.xmPhgdgzcmj }}</td>
          <td>{{ item.xmQzphyjjbntgzcmj }}</td>
        </tr>
      </table>
      <div v-if="istable == true">
        <div style="text-align: right">
          单位：公顷、万元&nbsp;&nbsp;&nbsp;&nbsp;
        </div>
        <table class="table" border="1" cellspacing="0" cellpadding="0">
          <tr class="trtitle">
            <td rowspan="2">序号</td>
            <td colspan="2">行政区</td>
            <td colspan="4" rowspan="2">项目名称</td>
            <td rowspan="2">设施农业类型</td>
            <td rowspan="2">上报日期</td>
            <td rowspan="2">生产规模</td>
            <td rowspan="2">项目总投资</td>
            <td rowspan="2">农业用地面积</td>
            <td rowspan="2">申请用地面积</td>
            <td colspan="2">按功能分区</td>
            <td colspan="4">其中面积</td>
            <td colspan="2">破坏耕作层面积</td>
          </tr>
          <tr class="trtitle">
            <td>地市</td>
            <td>县区</td>
            <td>生产设施用地</td>
            <td>辅助设施用地</td>
            <td>农用地</td>
            <td style="width: 60px">耕地</td>
            <td>永久基本农田</td>
            <td>补划永久基本农田</td>
            <td>破坏耕地耕作层</td>
            <td>破坏永久基本农田耕作层</td>
          </tr>
          <tr
            v-for="(item, index) in pjthjdata"
            :key="index"
            class="pjtr trtitle"
          >
            <td></td>
            <td></td>
            <td></td>
            <td colspan="4">共计：{{ ipagination.total }}个项目</td>
            <td></td>
            <td></td>
            <td>{{ item.xmScgm }}</td>
            <td>{{ item.xmZtz }}</td>
            <td>{{ item.xmNyydmj }}</td>
            <td>{{ item.xmZydmj }}</td>
            <td>{{ item.xmScssydmj }}</td>
            <td>{{ item.xmFzssydmj }}</td>
            <td>{{ item.xmSyndtmj }}</td>
            <td>{{ item.xmSygdmj }}</td>
            <td>{{ item.xmQzjbntmj }}</td>
            <td>{{ item.XmBhyjjbntmj }}</td>
            <td>{{ item.xmPhgdgzcmj }}</td>
            <td>{{ item.xmQzphyjjbntgzcmj }}</td>
          </tr>
          <tr
            v-for="(item, index) in pjydatalist"
            :key="item.dataSec"
            class="pjtr"
          >
            <td>{{ index + 1 }}</td>
            <td>{{ item.xmUsepoint }}</td>
            <td>{{ item.xmUsepoint1 }}</td>
            <td colspan="4">
              <a @click="detail(item)">{{ item.xmName }}</a>
            </td>
            <td style="width: 140px">{{ customer(item) }}</td>
            <td>{{ item.xmBarq }}</td>
            <td>{{ item.xmScgm }}</td>
            <td>{{ item.xmZtz }}</td>
            <td>{{ item.xmNyydmj }}</td>
            <td>{{ item.xmZydmj }}</td>
            <td>{{ item.xmScssydmj }}</td>
            <td>{{ item.xmFzssydmj }}</td>
            <td>{{ item.xmSyndtmj }}</td>
            <td>{{ item.xmSygdmj }}</td>
            <td>{{ item.xmQzjbntmj }}</td>
            <td>{{ item.xmBhyjjbntmj }}</td>
            <td>{{ item.xmPhgdgzcmj }}</td>
            <td>{{ item.xmQzphyjjbntgzcmj }}</td>
          </tr>
        </table>
        <div style="display: flex; justify-content: space-between">
          <div></div>
          <a-pagination
            style="padding-top: 16px; padding-right: 20px"
            v-model="ipagination.current"
            @change="pagechange1"
            :show-total="(total) => `共 ${ipagination.total} 条`"
            :total="ipagination.total"
            show-quick-jumper
            :showSizeChanger="true"
            @showSizeChange="handleTableChange"
          />
        </div>
      </div>
    </a-card>
  </div>
</template>

<script>
import {
  fkCitylist,
  cityQueryXian,
  analysisByShi,
  byProject,
  graphical,
  totalNum,
} from "../../api/api";
import { exportshitable, exportproject } from "../../api/api2";
import EcTable from "./modules/EcTable.vue";
import columnar from "./modules/columnar.vue";
import Stage from "./modules/Stage.vue";
export default {
  components: { EcTable, columnar, Stage },
  data() {
    return {
      citydata: [], //行政区下拉接口(市)
      xiandata: [], //行政区下拉接口(县)
      user: JSON.parse(localStorage.getItem("user")),
      xmjdlist: [
        { key: "", value: "全部" },
        { key: "0", value: "取得用地阶段" },
        { key: "1", value: "设施建设阶段" },
        { key: "3", value: "变更阶段" },
        { key: "9", value: "历史项目" },
      ],
      isInput: false,
      isInput2: false,
      form: {
        city: "3700",
        area: "",
        keyWord: "",
        begintime: "",
        endtime: "",
        xmld1: [],
        xmld2: [],
        xmld3: [],
        xmld4: [],
        type: [],
        sblx: "1",
        xmjd: "",
        isxztb:1,
        isyznum:1,
        isjdnum:1
      },
      zwdata: [
        { label: "粮食", value: "1001" },
        { label: "蔬菜", value: "1002" },
        { label: "花卉", value: "1003" },
        { label: "水果", value: "1004" },
        { label: "其他", value: "1006" },
      ],
      cldata: [
        { label: "猪", value: "2001" },
        { label: "牛", value: "2002" },
        { label: "羊", value: "2003" },
        { label: "驴", value: "2004" },
        { label: "兔", value: "2006" },
        { label: "其他", value: "2005" },
      ],
      qldata: [
        { label: "鸡", value: "3001" },
        { label: "鸭", value: "3002" },
        { label: "鹅", value: "3003" },
        { label: "其他", value: "3006" },
      ],
      scdata: [
        { label: "鱼类", value: "4001" },
        { label: "甲壳类", value: "4002" },
        { label: "其他", value: "4004" },
      ],
      indeterminate: false,
      allCheckboxValue: "ZW",
      // clindeterminate:false,
      clCheckboxValue: "CL",
      clindeterminate: false,
      qlheckboxValue: "QL",
      qlindeterminate: false,
      scindeterminate: false,
      scheckboxValue: "SC",
      drr1: [],
      drr2: [],
      drr3: [],
      drr4: [],
      tjtype: 1, //用来区分市级统计还是项目统计
      tjcitylist: [], //按照市级进行统计
      hjdata: [], //合计数据
      istable: false, //判断市市级表格还是项目表格
      pjydatalist: [],
      ipagination: {
        current: 1,
        pageSize: 10, // 默认每页显示数量
        pageSizeOptions: ["10", "30", "50"],
        showTotal: (total, range) => {
          return "共" + total + "条";
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
      },
      pjthjdata: [], //项目统计表格合计
      xmgsdata: [], //项目统计个数
      legendData: ["用地总面积", "养殖类用地总面积", "种植类用地总面积"],
      breedData:["禽类用地总面积", "畜类用地总面积", "水产用地总面积"],
      stageData:["取得用地情况总面积","项目建设情况总面积","项目变更情况总面积"]
    };
  },
  mounted() {
    this.dataList();
    this.getCtiydata();
    this.changeCity();
    this.getdatatable();
    this.getpjtcount();
  },
  methods: {
    //项目总体情况
    async getpjtcount() {
      const arr = this.form.xmld1.concat(
        this.form.xmld2,
        this.form.xmld3,
        this.form.xmld4
      );
      const brr = this.drr1.concat(this.drr2, this.drr3, this.drr4);
      const params = {
        area: this.form.area,
        city: this.form.city,
        types: "",
        xmlds: "",
        xmxls: "",
        jsrq: this.form.endtime,
        ksrq: this.form.begintime,
        sblx: this.form.sblx,
        xmjd: this.form.xmjd,
        type: this.form.type.length == 0 ? "" : this.form.type.join(","),
        keyWord: this.form.keyWord,
        xmld: brr.length == 0 ? "" : brr.join(","),
        xmxl: arr.length == 0 ? "" : arr.join(","),
      };
      const res = await totalNum(params);
      if (res.code == 200) {
        this.xmgsdata = res.result;
      }
    },
    //判断设施农业类型
    customer(record) {
      var ssnylxs = record.xmSsnylx;
      console.log(ssnylxs, "1111");
      var ssnylstr = "";
      if (ssnylxs == null || ssnylxs == "") {
        return "";
      } else {
        var ssnyssz = ssnylxs.split(",");
        if (ssnyssz.length > 0) {
          for (var i = 0; i < ssnyssz.length; i++) {
            if (ssnyssz[i].length > 0) {
              if (ssnyssz[i] == "1") {
                ssnylstr += "作物种植设施农用地  ";
              } else if (ssnyssz[i] == "2") {
                ssnylstr += "畜禽水产养殖设施农用地  ";
              }
            }
          }
        }
        return ssnylstr;
      }
    },
    dataList() {
      if (this.user.role == "xian" || this.user.role == "shi") {
        this.form.area =
        this.user.role == "xian" ? this.user.fkDept : this.form.area;
        this.form.city = this.user.fkDept.slice(0, 4);
        this.isInput2 = this.user.role == "xian" ? true : false;
        this.isInput = true;
      }
    },
    //获取行政区
    async getCtiydata() {
      const res = await fkCitylist();
      const arr = res.result;
      arr.unshift({
        name: "全部",
        no: "3700",
      });
      this.citydata = arr;
    },
    //选择行政区获取县级数据
    async changeCity(e) {
      console.log(e, "eee");
      const data = await cityQueryXian({
        cityNo: e == undefined ? this.user.fkDept.slice(0, 4) : e,
      });
      const brr = data.result;
      brr.unshift({
        name: "全部",
        no: "",
      });
      this.xiandata = brr;
    },
    //查询
    handleSubmit() {
      // this.getpjtcount();
      if (this.tjtype == 1) {
        this.istable = false;
        this.getdatatable();
      } else {
        this.istable = true;
        this.getpjtdata();
      }
    },
    //获取市级表格数据
    async getdatatable() {
      const arr = this.form.xmld1.concat(
        this.form.xmld2,
        this.form.xmld3,
        this.form.xmld4
      );
      const brr = this.drr1.concat(this.drr2, this.drr3, this.drr4);
      const params = {
        area: this.form.area,
        city: this.form.city,
        types: "",
        xmlds: "",
        xmxls: "",
        jsrq: this.form.endtime,
        ksrq: this.form.begintime,
        sblx: this.form.sblx,
        xmjd: this.form.xmjd,
        type: this.form.type.length == 0 ? "" : this.form.type.join(","),
        keyWord: this.form.keyWord,
        xmld: brr.length == 0 ? "" : brr.join(","),
        xmxl: arr.length == 0 ? "" : arr.join(","),
      };
      const res = await analysisByShi(params);
      if (res.code == 200) {
        this.tjcitylist = res.result;
        let sum = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmgs),
          0
        );
        let sum1 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmScgm),
          0
        );
        let sum2 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmZtz),
          0
        );
        let sum3 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmZydmj),
          0
        );
        let sum4 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.scZmj),
          0
        );
        let sum5 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.fzZmj),
          0
        );
        let sum6 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmQzjbntmj),
          0
        );
        let sum7 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmSygdmj),
          0
        );
        let sum8 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmSyndtmj),
          0
        );
        let sum9 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmBhyjjbntmj),
          0
        );
        let sum10 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmPhgdgzcmj),
          0
        );
        let sum11 = res.result.reduce(
          (accumulator, currentValue) =>
            Number(accumulator) + Number(currentValue.xmQzphyjjbntgzcmj),
          0
        );
        const arr = [];
        arr.push({
          name: "合计",
          xmgs: sum,
          xmScgm: sum1.toFixed(4),
          xmZtz: sum2.toFixed(4),
          xmZydmj: sum3.toFixed(4),
          scZmj: sum4.toFixed(4),
          fzZmj: sum5.toFixed(4),
          xmQzjbntmj: sum6.toFixed(4),
          xmSygdmj: sum7.toFixed(4),
          xmSyndtmj: sum8.toFixed(4),
          xmBhyjjbntmj: sum9.toFixed(4),
          xmPhgdgzcmj: sum10.toFixed(4),
          xmQzphyjjbntgzcmj: sum11.toFixed(4),
        });
        this.hjdata = arr;
      }
    },
    //项目表格统计
    async getpjtdata() {
      const arr = this.form.xmld1.concat(
        this.form.xmld2,
        this.form.xmld3,
        this.form.xmld4
      );
      const brr = this.drr1.concat(this.drr2, this.drr3, this.drr4);
      const pag = this.ipagination;
      const params = {
        area: this.form.area,
        city: this.form.city,
        types: "",
        xmlds: "",
        xmxls: "",
        jsrq: this.form.endtime,
        ksrq: this.form.begintime,
        sblx: this.form.sblx,
        xmjd: this.form.xmjd,
        type: this.form.type.length == 0 ? "" : this.form.type.join(","),
        keyWord: this.form.keyWord,
        xmld: brr.length == 0 ? "" : brr.join(","),
        xmxl: arr.length == 0 ? "" : arr.join(","),
        pageNo: pag.current,
        pageSize: pag.pageSize,
      };
      const res = await byProject(params);
      if (res.code == 200) {
        this.pjydatalist = res.result.records;
        const data = res.result.records;
        pag.total = res.result.total;
        //生产规模
        const xmScgm = data.reduce(
          (sum, item) => sum + (item.xmScgm == null ? 0 : item.xmScgm),
          0
        );
        // 项目总投资
        const xmZtz = data.reduce(
          (sum, item) => sum + (item.xmZtz == null ? 0 : item.xmZtz),
          0
        );
        //农业用地面积
        const xmNyydmj = data.reduce(
          (sum, item) => sum + (item.xmNyydmj == null ? 0 : item.xmNyydmj),
          0
        );
        //申请用地面积
        const xmZydmj = data.reduce(
          (sum, item) => sum + (item.xmZydmj == null ? 0 : item.xmZydmj),
          0
        );
        // 生产设施用地
        const xmScssydmj = data.reduce(
          (sum, item) => sum + (item.xmScssydmj == null ? 0 : item.xmScssydmj),
          0
        );
        // 辅助设施用地
        const xmFzssydmj = data.reduce(
          (sum, item) => sum + (item.xmFzssydmj == null ? 0 : item.xmFzssydmj),
          0
        );
        //农用地
        const xmSyndtmj = data.reduce(
          (sum, item) => sum + (item.xmSyndtmj == null ? 0 : item.xmSyndtmj),
          0
        );
        // 耕地
        const xmSygdmj = data.reduce(
          (sum, item) => sum + (item.xmSygdmj == null ? 0 : item.xmSygdmj),
          0
        );
        //永久基本农田
        const xmQzjbntmj = data.reduce(
          (sum, item) => sum + (item.xmQzjbntmj == null ? 0 : item.xmQzjbntmj),
          0
        );
        //补划永久基本农田
        const XmBhyjjbntmj = data.reduce(
          (sum, item) =>
            sum + (item.XmBhyjjbntmj == null ? 0 : item.XmBhyjjbntmj),
          0
        );
        //破坏耕地耕作层
        const xmPhgdgzcmj = data.reduce(
          (sum, item) =>
            sum + (item.xmPhgdgzcmj == null ? 0 : item.xmPhgdgzcmj),
          0
        );
        //破坏永久基本农田耕作层
        const xmQzphyjjbntgzcmj = data.reduce(
          (sum, item) =>
            sum + (item.xmQzphyjjbntgzcmj == null ? 0 : item.xmQzphyjjbntgzcmj),
          0
        );
        const brr = [];
        brr.push({
          xmScgm: xmScgm.toFixed(4),
          xmZtz: xmZtz.toFixed(4),
          xmNyydmj: xmNyydmj.toFixed(4),
          xmZydmj: xmZydmj.toFixed(4),
          xmScssydmj: xmScssydmj.toFixed(4),
          xmFzssydmj: xmFzssydmj.toFixed(4),
          xmSyndtmj: xmSyndtmj.toFixed(4),
          xmSygdmj: xmSygdmj.toFixed(4),
          xmQzjbntmj: xmQzjbntmj.toFixed(4),
          XmBhyjjbntmj: XmBhyjjbntmj.toFixed(4),
          xmPhgdgzcmj: xmPhgdgzcmj.toFixed(4),
          xmQzphyjjbntgzcmj: xmQzphyjjbntgzcmj.toFixed(4),
        });
        this.pjthjdata = brr;
      }
    },
    pagechange1(start, end) {
      this.ipagination.pageNo = start;
      this.ipagination.pageSize = end;
      this.getpjtdata();
    },
    //作物全选事件
    ZWchangAll(e) {
      console.log(e, "////");
      this.drr1 = e;
      if (e.includes(this.allCheckboxValue)) {
        this.form.xmld1 = this.zwdata.map((item) => item.value);
      }
      if (this.form.xmld1.length == 5) {
        this.indeterminate = !this.indeterminate;
        if (this.indeterminate == false) {
          this.form.xmld1 = [];
          this.drr1 = [];
        }
      } else if (this.form.xmld1.length < 5) {
        this.indeterminate = false;
      }
      console.log(this.form.xmld1, "2222");
    },
    ZWchang(e) {
      if (e.target.checked) {
        this.form.xmld1 = ["ZW", ...this.zwdata.map((item) => item.value)];
      } else {
        this.form.xmld1 = [];
      }
    },
    //畜类全选事件
    CLchageAll(e) {
      this.drr2 = e;
      if (e.includes(this.clCheckboxValue)) {
        this.form.xmld2 = this.cldata.map((item) => item.value);
      }
      if (this.form.xmld2.length == 6) {
        this.clindeterminate = !this.clindeterminate;
        if (this.clindeterminate == false) {
          this.form.xmld2 = [];
          this.drr2 = [];
        }
      } else if (this.form.xmld2.length < 6) {
        this.clindeterminate = false;
      }
    },
    CLchang(e) {
      if (e.target.checked) {
        this.form.xmld2 = ["CL", ...this.cldata.map((item) => item.value)];
      } else {
        this.form.xmld2 = [];
      }
    },
    //禽类全选事件
    QLchangeAll(e) {
      this.drr3 = e;
      if (e.includes(this.qlheckboxValue)) {
        this.form.xmld3 = this.qldata.map((item) => item.value);
      }
      if (this.form.xmld3.length == 4) {
        this.qlindeterminate = !this.qlindeterminate;
        if (this.qlindeterminate == false) {
          this.form.xmld3 = [];
          this.drr3 = [];
        }
      } else if (this.form.xmld3.length < 4) {
        this.qlindeterminate = false;
      }
    },
    qlchange(e) {
      if (e.target.checked) {
        this.form.xmld3 = ["QL", ...this.qldata.map((item) => item.value)];
      } else {
        this.form.xmld3 = [];
      }
    },
    //水产全选事件
    SCchangeAll(e) {
      this.drr4 = e;
      if (e.includes(this.scheckboxValue)) {
        this.form.xmld4 = this.scdata.map((item) => item.value);
      }
      if (this.form.xmld4.length == 3) {
        this.scindeterminate = !this.scindeterminate;
        if (this.scindeterminate == false) {
          this.form.xmld4 = [];
          this.drr4 = [];
        }
      } else if (this.form.xmld4.length < 3) {
        this.scindeterminate = false;
      }
    },
    SCchange(e) {
      if (e.target.checked) {
        this.form.xmld4 = ["SC", ...this.scdata.map((item) => item.value)];
      } else {
        this.form.xmld4 = [];
      }
    },
    //跳转详情页面
    detail(data) {
      this.$router.push({
        path: "/admin/agriculand",
        query: {
          type: "detail",
          diff: "xq",
          id: data.dataSec,
        },
      });
    },
    handleTableChange(pagination, filters, sorter) {
      this.ipagination.current = pagination;
      this.ipagination.pageSize = filters;
      this.getpjtdata();
    },
    //导出exce
    async exportdata() {
      const arr = this.form.xmld1.concat(
        this.form.xmld2,
        this.form.xmld3,
        this.form.xmld4
      );
      const brr = this.drr1.concat(this.drr2, this.drr3, this.drr4);
      const pag = this.ipagination;
      const params = {
        area: this.form.area,
        city: this.form.city,
        types: "",
        xmlds: "",
        xmxls: "",
        jsrq: this.form.endtime,
        ksrq: this.form.begintime,
        sblx: this.form.sblx,
        xmjd: this.form.xmjd,
        type: this.form.type.length == 0 ? "" : this.form.type.join(","),
        keyWord: this.form.keyWord,
        xmld: brr.length == 0 ? "" : brr.join(","),
        xmxl: arr.length == 0 ? "" : arr.join(","),
        pageNo: pag.current,
        pageSize: pag.pageSize,
      };
      if (this.tjtype == 1) {
        const res = await exportshitable(params);
        // 创建一个新的Blob对象，其中包含文件的内容
        const blob = new Blob([res.data], { type: "application/vnd.ms-excel" });
        // 创建一个指向该Blob的URL
        const url = window.URL.createObjectURL(blob);
        // 创建一个a标签用于下载文件
        const link = document.createElement("a");
        link.href = url;
        link.setAttribute("download", "设施农业用地.xlsx"); // 设置下载文件名
        document.body.appendChild(link);
        // 触发下载
        link.click();
        // 清理并释放资源
        window.URL.revokeObjectURL(url);
        document.body.removeChild(link);
      } else {
        const res = await exportproject(params);
        // 创建一个新的Blob对象，其中包含文件的内容
        const blob = new Blob([res.data], { type: "application/vnd.ms-excel" });
        // 创建一个指向该Blob的URL
        const url = window.URL.createObjectURL(blob);
        // 创建一个a标签用于下载文件
        const link = document.createElement("a");
        link.href = url;
        link.setAttribute("download", "设施农业用地.xlsx"); // 设置下载文件名
        document.body.appendChild(link);
        // 触发下载
        link.click();
        // 清理并释放资源
        window.URL.revokeObjectURL(url);
        document.body.removeChild(link);
      }
    },
    //用地面积
    landarea(type) {
      if (type == 1) {
        this.legendData = [
          "用地总面积",
          "养殖类用地总面积",
          "种植类用地总面积",
        ];
        this.$refs.EcTable.dataSource()
        this.form.isxztb = 1
      }else if(type == 2)
      {
        this.breedData = ["禽类用地总面积", "畜类用地总面积", "水产用地总面积"]
        this.$refs.columnar.getdataSource()
        this.form.isyznum = 1
      }else if(type == 3)
      {
        this.stageData = ["取得用地情况总面积","项目建设情况总面积","项目变更情况总面积"]
        this.$refs.Stage.dataSource()
        this.form.isjdnum = 1
      }
    },
    //项目个数
    Pjtnum(type) {
      if (type == 1) {
        this.legendData = ["项目个数", "养殖类项目个数", "种植类项目个数"];
        this.$refs.EcTable.dataSource()
        this.form.isxztb = 2
      }else if(type == 2)
      {
        this.breedData = ["禽类项目个数", "畜类项目个数", "水产项目个数"]
        this.$refs.columnar.getdataSource()
        this.form.isyznum = 2
      }else if(type == 3)
      {
        this.stageData = ["取得用地情况个数","项目建设情况个数","项目变更情况个数"]
        this.$refs.Stage.dataSource()
        this.form.isjdnum = 2
      }
    },
  },
};
</script>

<style lang="less" scoped>
.trtitle {
  font-weight: 700;
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", sans-serif;
  color: #4d5259;
}
.table {
  width: 100%;
  height: 100%;
  td {
    border-collapse: collapse;
    border: 1px solid black;
    text-align: center;
    height: 50px;
    // max-width: 100px;
  }
}
.title {
  width: 99.5%;
  height: 40px;
  background-color: #33cabb !important;
  .title_data {
    padding: 0px 24px;
    line-height: 40px;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
      Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB",
      "Microsoft YaHei", sans-serif;
    color: #fff !important;
    font-size: 18px;
  }
}
.ztqk {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.box {
  width: 16%;
  height: 100px;
  background-color: red;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue",
    "PingFang SC", "Microsoft YaHei", "Source Han Sans SC", "Noto Sans CJK SC",
    "WenQuanYi Micro Hei", sans-serif;
  color: #ffffff !important;
}
.box_title {
  letter-spacing: 1px;
  font-size: 14px;
  font-weight: 500;
  margin: 20px 0 0 5px;
}
.box_num {
  font-size: 18px;
  margin: 10px 0 0 5px;
  font-weight: 800;
}
.box1 {
  background-color: #fc952a !important;
}
.box2 {
  background-color: #4a88c8 !important;
}
.box3 {
  background-color: #b7b7b7 !important;
}
.box4 {
  background-color: #f96868 !important;
}
.box5 {
  background-color: #15c377 !important;
}
.box6 {
  background-color: #8a2be2 !important;
}
.ztqk_right {
  width: 30%;
  text-align: center;
  .tztqk_title {
    text-align: center;
  }
}
.pjtr:hover {
  background-color: rgb(198, 222, 240) !important;
}
</style>